/* 定位 */
.absolute-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

/* flex布局 */
.flexRBC {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flexRCC {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flexRAC {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.flexRBS {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.flexRBE {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.flexRSC {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.flexREC {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.flexRSS {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.flexRSE {
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}

//col布局
.colCCA {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}

.colCCC {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.colCSC {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

.colCSS {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.colCES {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}

.colCAE {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-around;
}

.colCAS {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-around;
}

//简单版布局
.center {
  //居中定位
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

.center-50 {
  //居中定位
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

//以下是居中的样式
.flexCB {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flexCA {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.flexCS {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.flexCE {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.flexSS {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.flexES {
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}

.flexEB {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.flexSB {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.flexES {
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}

.colCA {
  //纵向居中
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}

.colCB {
  //纵向居中
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.colCS {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

.colCE {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
}

.colSS {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.colSA {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-around;
}

.colSB {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
}

.colEA {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-around;
}

.item-split:not(:last-child) {
  padding: 0 10px;
  border-right: 1px solid #ddd;
}

.item-split:last-child {
  padding-left: 10px;
}

.item-split:nth-child(2) {
  padding-left: 0;
}

//标题过长隐藏
.title-Hidden-one {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  line-height: 12px;
}

/*返回*/
.back-btn{
  margin: 0 auto;
  margin-top: 67px;
  width:200px;
  height:44px;
  border:1px solid rgba(78,134,254,1);
  border-radius:22px;
  font-size:16px;
  font-family:PingFang SC;
  font-weight:400;
  color:rgba(78,134,254,1);
  text-align: center;
  line-height: 44px;
}

.title-Hidden-two {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

//居中浮动定位
.center {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

.center-50 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

//字段分割符合
.item-split-line {
  display: inline-block;
  width: 1px;
  height: 10px;
  background-color: #ddd;
  margin: 0 5px;
}


/* 扩大点击范围 */
.app-large-click-range {
  position: relative;

  &:before {
    content: '';
    position: absolute;
    top: -20px;
    left: -20px;
    right: -20px;
    bottom: -20px;
  }
}
